<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head th:include="public/page_css::page_css ('新增补货单')" />
<!--<head>-->
<!--<meta charset="UTF-8"/>-->
<!--<title>Title</title>-->
<!--&lt;!&ndash; load css &ndash;&gt;-->
<!--<link rel="stylesheet" type="text/css" th:href="@{/plugin/layui/css/font/iconfont.css}" media="all"/>-->
<!--<link rel="stylesheet" type="text/css" th:href="@{/plugin/layui/js/layui/css/layui.css}"  media="all"/>-->
<!--<link rel="stylesheet" type="text/css" th:href="@{/plugin/bootstrap/bootstrap/css/bootstrap.min.css}"/>-->
<!--<link rel="stylesheet" type="text/css" th:href="@{/plugin/bootstrap-table/bootstrap-table.css}"/>-->
<!--<link rel="stylesheet" type="text/css" th:href="@{/css/table.css}"  media="all"/>-->
<!--<link rel="stylesheet" type="text/css" th:href="@{/plugin/bootstrap/bootstrap/css/bootstrap.min.css}"/>-->
<!--<link rel="stylesheet" type="text/css" th:href="@{/plugin/layui/js/select2/css/select2.css}" media="all"/>-->

<!--<style>-->
<!--</style>-->
<!--</head>-->
<body>
<div id="simplewizardinwidget" class="wizard" data-target="#simplewizardinwidget-steps">
    <div class="layui-card">
        <form class="layui-form layui-card-header  layui-card-header-auto" id="myform">
            <div class="layui-inline">
                <label class="layui-form-label">货品编号</label>
                <div class="layui-input-inline">
                    <input type="text" name="hpbh" id="hpbh" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">货品名称</label>
                <div class="layui-input-inline">
                <input type="text" name="hpmc" id="hpmc" autocomplete="off" class="layui-input">
            </div>
            </div>
            <div class="layui-inline inline-search-btn">
                <a class="layui-btn layui-btn-normal" data-type="reload">搜索</a>
            </div>
            <div>
                <div class="layui-col-xs24" >
                    <table data-height="300" data-single-select="false"	 id="table"></table>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">补货单</label>
                    <div class="layui-input-inline">
                        <input type="text" name="bh" id="bh" autocomplete="off" readonly class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">备注</label>
                    <div class="layui-input-inline">
                        <input type="text" name="bz" id="bz" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-col-xs24" style="max-height: 300px;overflow: auto">
                    <table data-height="300" id="table1"></table>
                </div>
                <div class="layui-input-block" style="float: right;">
                    <button class="layui-btn" lay-submit lay-filter="add">立即提交</button>
                </div>
            </div>
        </form>
    </div>
</div>
<div style="padding: 0px 15px;" hidden="hidden" id="addfunction">

    <div class="layui-fluid larry-wrapper">
        <div class="layui-card">
            <!--  <div class="layui-row layui-col-space30">-->
            <!--<div class="layui-col-xs24">-->
            <form class="layui-form layui-card-header  layui-card-header-auto" id="tiaozhengForm">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">货品编号</label>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" lay-verify="required" name="hpbh" id="show_hpbh" readonly/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">货品名称</label>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" ame="hpmc" id="show_hpmc" readonly/>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">补货库位</label>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" name="kwmc" id="kwmc" readonly/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">存储区可用数量</label>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" name="ccqsl" id="ccqsl" readonly/>
                        </div>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">补货数量</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" name="sl" id="sl" />
                    </div>
                </div>
                <input type="hidden" id="parentIndex" name="parentIndex"><!--父行的索引-->

            </form>
        </div>
        <div class="group-button" id="button1" style="float: right;display:block">
            <a class="layui-btn layui-btn-sm layui-btn-normal confirm">确认
                <i class="layui-icon">&#x1005;</i>
            </a>
            <a class="layui-btn layui-btn-sm layui-btn-normal cancel">
                <i class="layui-icon">&#x1006;</i> 取消
            </a>
        </div>
        <div>
        </div>
    </div>
</div>
</body>
<div th:include="public/public_js::public_js"></div>
<script th:src="@{/plugin/beyond/assets/js/fuelux/wizard/wizard-custom.js}"></script>

<script>
    layui.use(['myform','zzpUtils','form','laydate','jquery','zzpValidation'],function () {
        var form = layui.form,
        zzpUtils = layui.zzpUtils
            ,laydate = layui.laydate
            ,zzpValidation = layui.zzpValidation
            ,$ = layui.jquery;
        // 行内按钮
        window.operateEvent ={
            "click .editRow": function (e, value, row, index) {
                editDialog(row, index);
            },
            "click .deleteRow": function (e, value, row, index) {//删除
                var tabledata = $table.bootstrapTable('getData');
                console.info("删除行");
                console.info(row);
                var id = [];
                id.push(row.id);
                console.log(id);
                $table1.bootstrapTable('remove', {field: 'id', values: id});
                //$table1.bootstrapTable('load', tabledata);
            },
        }
        var ind = "";
        var currentIframe = "";
        var sl;
        function editDialog(row, indexs) {
            ind = indexs;
            layer.open({
                type: 1,
                title: "编辑",
                content: $("#addfunction"),
                area: ['850px', '400px'],
                shade: [0.4, '#393D49'],
                success: function (layero, index) {
                    currentIframe = index;
                    $("#show_hpbh").val(row.hpbh);
                    $("#show_hpmc").val(row.hpmc);
                    $("#kwmc").val(row.kwmc);
                    $("#ccqsl").val(row.ccqsl);
                    $("#sl").val(row.sl);
                    $("#parentIndex").val(indexs);
                },
            })
        }
        $(".confirm").click(function (e, value, row, index) {
                    var formObject = {};
                    //自动将form表单封成json
                    var formArray = $("#tiaozhengForm").serializeArray();
                    $.each(formArray, function (i, item) {
                        formObject[item.name] = item.value;
                    });
                    console.log('11111===='+formObject.sl);
                    console.log('22222===='+formObject.ccqsl);
                    if (parseInt(formObject.sl)>parseInt(formObject.ccqsl)) {
                        layer.msg("不可大于存储数量");
                    } else {
                    var row = formObject;
                    row.sl = $("#sl").val();
                    $table1.bootstrapTable('updateRow',{index: ind, row: row});
                    layer.close(currentIframe);
                }
        });
        //调整取消
        $(".cancel").click(function () {
            layer.close(currentIframe);
        });
        laydate.render({
            elem: '#test5'
            , theme: '#20a0ff'
        })
        $('#simplewizardinwidget').wizard().on('finished',function () {
            alert("结束啦");
        });
        laydate.render({
            elem: '#test1'
            ,theme: '#20a0ff'
            ,type: 'datetime'
        });
        laydate.render({
            elem: '#test2'
            ,theme: '#20a0ff'
            ,type: 'datetime'
        });
        var $table = zzpUtils.table({
            elem: '#table',
            isApi: true,
            pagination:true,
            showColumns: false,
            url: '/wmsartificialreplenishment/getGoods',
            columns: [
                {
                    field: '',
                    checkbox: true
                }, {
                    field: 'show_kwlx',
                    title: '库位类型',
                },{
                    field: 'kwmc',
                    title: '库位名称'
                },{
                    field: 'dw',
                    title: '单位类型'
                },{
                    field: 'hpbh',
                    title: '货品编号',
                },{
                    field: 'hpmc',
                    title: '货品名称',
                },{
                    field: 'ccqsl',
                    title: '存储区数量',
                },{
                    field: 'sl',
                    title: '补货数量',
                    formatter: operateFormatterNumber,
                },{
                    field: 'jhqsl',
                    title: '拣货区数量',
                },{
                    field: 'bhsx',
                    title: '补货上限',
                }],
            detailFormatter: function (index, row) {
                return "这里就没有确定过11";
            },
            onDblClickRow: function (row) {
//                alert(1111);
                var data = $table1.bootstrapTable('getData');
                var returnrows = $.map(data,function (rowdata) {
                    if(rowdata.id==row.id){
                        return rowdata.id;
                    }
                })
                if(returnrows.length>0){
                    alert("已存在不能重复添加");
                }else{
                    //双击添加行
//                    $table.bootstrapTable('append', row);
//                    alert('else');
                    var newdata = $.extend(true,[],row); //复制一份数据
                    row.sl=$("#sl"+row.id).val();
                    if(parseInt(row.sl)>parseInt(row.ccqsl)){
                        alert("不可大于存储区数量");
                    }else{
                        $table1.bootstrapTable("append",row);
                    }
                }
            },
            queryParams: function () {//查询条件
                return zzpUtils.getFormJson($("#myform"));
            },
            detailFormatter: function (index, row) {
                return "这里就没有确定过11";
            }
        });
        function operateFormatterNumber (value,row,index) {
            return [
                '<input type="number" class="layui-input" id="sl'+row.id+'" value="'+ 1 +'"  name="sl" min="1" step="1"   style="width:80px;    height: 30px;"/>'
                /* '<input type="text" id="pdsl'+row.id+'"  name="pdsl" value="'+ value +'" style="width:80px;"/>',*/
            ].join('')
        }
        var $table1 = zzpUtils.table({
            elem: '#table1',
            isApi: true,
            pagination:false,
            showColumns: false,
            url: '[{}]',
            columns: [
                {
                    field: '',
                    checkbox: true
                }, {
                    field: 'hpbh',
                    title: '货品编号',
                },{
                    field: 'hpmc',
                    title: '货品名称',
                },{
                    field: 'dw',
                    title: '单位',
                },{
                    field: 'kwmc',
                    title: '补货库位',
                },{
                    field: 'sl',
                    title: '补货数量主',
                },{
                    field:'caozuo',
                    title: '操作',
                    events: operateEvent,
                    formatter: operateFormatter
                }],
            detailFormatter: function (index , row) {
                return "这里就没有确定过11";
            },
        });

        function operateFormatter(value, row, index) {
            return [
                '<a class="  layui-btn layui-btn-normal  layui-btn-xs editRow" >编辑</a>',
                '<a class="layui-btn layui-btn-xs layui-btn-danger deleteRow" >删除</a>'
            ].join('')
        }

        //保存
        $("#savebtn").on('click', function () {
            console.log(213);
            var ids = [];
            var tabledata = $table1.bootstrapTable('getSelections');
            console.log('tabledata', tabledata);
            tabledata.forEach(function (item) {
                console.log('iemte', item.id);
                ids.push(item.id);
            });
            if (tabledata.length <= 0) {
                layer.msg("请选择一条进行保存");
            } else {
                $.ajax({
                    type: 'post',
                    url: '/zxsswms/wmsLpn/getPrintLpnCode',
                    contentType: "application/json",
                    async: false,
                    data: JSON.stringify({
                        ids: ids,
                    }),
                    success: function (res) {
                        console.log(res);
                    }
                })
            }
        });
        var bh=$("#bh").val();
        $(function () {
            $.ajax({
                url: "/zxsswms/wmsartificialreplenishment/getBhbh",
                type: "GET",
                dataType: "JSON",
                contentType: 'application/json',
                async: false,
                data:{},
                success: function (data) {
                   console.log("232131==="+data)
                    document.getElementById("bh").value = data;
                },
                error: function () { console.log("Error"); }
            });
        })
        //添加一行
        $("#addbtn").on('click',function () {
            var isRepeat;
            var $rows = $table.bootstrapTable('getSelections');
            console.log('$row', $rows);
            var tabledata = $table1.bootstrapTable('getData');
            console.log('tabledata', tabledata);
//            console.log(JSON.stringify($rows));
            //$copytable.bootstrapTable('append', $rows[0]);
            if (tabledata.length ===0) {
                $table1.bootstrapTable('append', $rows);
            } else {
                for (var i=0;i<$rows.length;i++){
                    isRepeat = tabledata.every(function (item) {
                        return (item.id !== $rows[i].id)
                    });
                    if (!isRepeat){
                        break;
                    }
                }
                console.log('isRepeat', isRepeat);
                if (isRepeat) {
                    $table1.bootstrapTable('append', $rows);
                } else {
                    layer.msg('已存在不能重复添加');
                }
            }
        });
        // 执行保存
        form.on("submit(add)",function(data){
            var field = data.field;
            zzpUtils.confirm("是否确认添加",function(index){
                var wardList=[];
                var SaveData = {};
                //获取table数据
                var TableData = $table1.bootstrapTable('getData');
                if (TableData.length > 0) {
                    TableData.forEach(function (item) {
                        var items = item;
                        delete items.index;
                        wardList.push(items);
                    });
                    SaveData.bz = field.bz;
                    SaveData.bh = field.bh;
                    SaveData.wardList = wardList;
                zzpUtils.action({
                    url:"/wmsartificialreplenishment/add",
                    data: JSON.stringify(SaveData),
                    success:function (data) {
                        setTimeout(function(){
                            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                            parent.layer.close(index); //再执行关闭
                            top.layer.msg(data.title);
                        },500);
                    },error: function (xhr, textStatus) {
                        console.log(textStatus);
                        console.log(xhr);
                    }
                })
                } else {
                    layer.msg('您还不能保存，采购订单明细为必填项');
                }
            })
            return false;
        })
        $(".inline-search-btn").on('click', function () {
            zzpUtils.refreshTable("#table");
        });
    });

</script>
</html>